<%@ page language="java" contentType="text/html; charset=UTF-8" isELIgnored="false" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<base href="${ctx}">
<title>我的事务</title>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<link type="text/css" media="screen" charset="utf-8" rel="stylesheet" href="${ctx}/commons/css/common.css" />
<link type="text/css" media="screen" charset="utf-8" rel="stylesheet" href="${ctx}plugins/fancybox-1.3.4/jquery.fancybox-1.3.4.css" />
<script type="text/javascript" src="${ctx}plugins/jquery/jquery-1.7.min.js"></script>
<script type="text/javascript" src="${ctx}plugins/fancybox-1.3.4/jquery.mousewheel-3.0.4.pack.js"></script>
<script type="text/javascript" src="${ctx}plugins/fancybox-1.3.4/jquery.fancybox-1.3.4.pack.js"></script>
<script type="text/javascript">
	$(document).ready(function() {
		//鼠标经过时结果行背景变色
		$(".tb-table>table tr:gt(0)").hover(function() {
			$(this).css("background", "#EEEEEE");
		}, function() {
			$(this).css("background", "");
		});
		$("#showInstance").fancybox({
			'margin'		: 0,
			'width' 		: '80%',
			'height' 		: '90%',
			'autoScale' 	: false,
			'transitionIn' 	: 'none',
			'transitionOut' : 'none',
			'type' 			: 'iframe',
		});
	});
	//启动流程，注此处是在页面调用“调度台”控制器的start方法
	//你也可以在你自己的控制器或者其他地方直接调用DispatcherStation下的的startProcess(String relatedNo, String flowCode)方法
	//再次启动也可调用该方法
	function testStart(relatedNo){
		if (Boolean(relatedNo) && Boolean($("#flowCode").val())) {
			$.post(
				"dispatcherStation.htm",
				{
					action : "START",
					relatedNo : relatedNo,
					flowCode : $("#flowCode").val()
				},
				function(data) {
					if (data == 'Y') {
						alert("启动成功！");
					} else {
						alert("启动失败！或已启动。");
					}
					$("#form").submit();
				});
		}
	}
	//取消控制即清除流程实例，也可在其他控制器中或者其他地方直接调用DispatcherStation下的deleteProcessInstance方法，效果相同
	function deleteInstance(relatedNo){
		if (Boolean(relatedNo) && confirm("取消控制后，将清除控制实例及操作记录。\n\n您确定要取消对该事务的流程控制吗？")) {
			$.post(
				"dispatcherStation.htm",
				{
					action : "DELETE",
					relatedNo : relatedNo,
				},
				function(data) {
					if (data == 'Y') {
						alert("已取消！");
					} else {
						alert("取消失败！");
					}
					$("#form").submit();
				});
		}
	}
	function showInstance(relatedNo){
		if(Boolean(relatedNo)){
			var obj = $("#showInstance");
			obj.attr("href","${ctx}dispatcherStation.htm?action=SHOW&relatedNo=" + relatedNo);
			obj.trigger("click");
		}
	}
	function waitingForMe(){
		window.open("test/flowTest.htm?action=WAITING_FOR_ME");
	}
	function historyAffair(){
		window.open("test/flowTest.htm?action=HISTORY_AFFAIR_OF_ME");
	}
</script>
</head>
<body>
	<div align="right">
		<span><a href="javascript:waitingForMe()">我的待办事务</a></span>&emsp;
		<span><a href="javascript:historyAffair()">查看历史事务</a></span>&emsp;
	</div>
	<div align="center">
		<form id="form" action="test/flowTest.htm" method="post">
			<input type="hidden" name="action" value="ADD_AFFAIR" />
			<br> 事务编号：<input type="text" name="affair" value="" />
			<input type="submit" value="加入列表" /><br><br>
		</form>
	</div>
	<div align="center">
		<c:forEach var="pi" items="${piMap}">
			关联编号：${pi.key} &emsp; 状态值：${pi.value}<br>
		</c:forEach>
	</div>
	<h3 class="fn-mt7">
		<span style="float: left; font-size: 14px; font-weight: bold;">事务列表</span>
		<span style="margin-left: 67%;">
			流程类型：
			<select id="flowCode" name="flowCode">
				<c:if test="${flowMap != null && fn:length(flowMap) > 0 }">
					<option value="">请选择</option>
					<c:forEach var="flow" items="${flowMap }">
						<option value="${flow.key }">${flow.value }</option>
					</c:forEach>
				</c:if>
			</select>
		</span>
		<br style="height: 0; clear: both;" />
	</h3>
	<c:if test="${affairList != null}">
		<div class="tb-table">
			<table id="tab">
				<thead>
					<tr>
						<th width="30">序 号</th>
						<th>事务编号</th>
						<th width="120">状态</th>
						<th>操&emsp;作</th>
					</tr>
				</thead>
				<tbody>
					<c:choose>
						<c:when test="${fn:length(affairList) > 0}">
							<c:forEach var="affair" items="${affairList}" varStatus="str">
								<tr>
									<td align="center"><c:out value="${str.count}" /></td>
									<td align="center"><c:out value="${affair}" /></td>
									<td align="center">
										<c:choose>
											<c:when test="${empty piMap[affair]}">未启动</c:when>
											<c:otherwise>
												<c:if test="${piMap[affair] eq 49}">办理中</c:if>
												<c:if test="${piMap[affair] eq 48}">未通过</c:if>
												<c:if test="${piMap[affair] eq 50}">已完成</c:if>
											</c:otherwise>
										</c:choose>
									</td>
									<td align="center">
										<!-- 在实例中找不到状态的，说明是未启动的事务，这时应该可以调用“启动流程”的功能 -->
										<c:if test="${empty piMap[affair]}">
											<a href="javascript:void(0)" onclick="testStart('${affair}')">启动流程</a>&emsp;
										</c:if>
										<!-- 以下是已存在实例的情况 -->
										<c:if test="${!empty piMap[affair]}">
											<!-- 当在实例的状态为0时，说明受阻了，这时应该可以调用“再次启动”的功能 -->
											<c:if test="${piMap[affair] eq 48}">
												<a href="javascript:void(0)" onclick="testStart('${affair}')">再次启动</a>&emsp;
											</c:if>
											<!-- “取消控制”的功能，只应该在事务的实例的状态为未完成时，才可以调用 -->
											<c:if test="${piMap[affair] != 50}">
												<a href="javascript:deleteInstance('${affair}')">取消控制</a>&emsp;
											</c:if>
											<!-- “操作详情”功能，只要实例存在都应该可以调用 -->
											<a href="javascript:void(0)" onclick="showInstance('${affair}')">详情</a>&emsp;
										</c:if>
									</td>
								</tr>
							</c:forEach>
						</c:when>
						<c:otherwise>
							<tr>
								<td class="center" colspan="4">没有事务</td>
							</tr>
						</c:otherwise>
					</c:choose>
				</tbody>
			</table>
		</div>
	</c:if>
	<a id="showInstance" href="" style="display: none;"></a>
</body>
</html>